let index = layer.load(0,{shade:[0.3,'#ccc']});
bindHtml()
async function bindHtml(){
    let msobj=await pAjax({url:'../server/scenics.php',data:{pid:3},dataType:'json'})
    let {data:msarr}=msobj
    let msStr=msarr.map(v=>{
        return `
        <div class="col-sm-6 col-md-3 text-center detail" index=${v.id} >
                        <div class="thumbnail tr">
                          <img src="${v.imgpath.split('==========')[0]}" alt="...">
                          <div class="caption">
                            <p><strong>${v.name}</strong></p>
                            <p class="dian">${v.introduce}</p>
                            <p style="color: rgb(232, 94, 94);">￥${v.price}</p>
                          </div>
                        </div>
        </div>
        `
    }).join('');
    $('.miaosha').html(msStr);

    let bkobj=await pAjax({url:'../server/scenics.php',data:{pid:2},dataType:'json'})
    let {data:bkarr}=bkobj
    let bkStr=bkarr.map(v=>{
        return `
        <div class="col-sm-6 col-md-3 text-center detail" index=${v.id} >
                        <div class="thumbnail tr">
                          <img src="${v.imgpath.split('==========')[0]}" alt="...">
                          <div class="caption">
                            <p class="dian"><strong>${v.name}</strong></p>
                            <p style="color: rgb(232, 94, 94);">￥${v.price}</p>
                          </div>
                        </div>
        </div>
        `
    }).join('');
    $('.baokuan').html(bkStr);

    let sjobj=await pAjax({url:'../server/scenics.php',data:{pid:13},dataType:'json'})
    let {data:sjarr}=sjobj
    let sjStr=sjarr.map(v=>{
        return `
        <div class="col-sm-6 col-md-3 text-center detail" index=${v.id} >
                    <div class="thumbnail tr">
                      <img src="${v.imgpath.split('==========')[0]}" alt="...">
                      <div class="caption">
                        <p><strong>${v.name}</strong></p>
                        <p class="dian">${v.introduce}</p>
                        <p style="color: rgb(232, 94, 94);">￥${v.price}</p>
                      </div>
                    </div>
                </div>    
        `
    }).join('');
    $('.shouji').html(sjStr);
    
    layer.close(index);
}

$('.swiper-wrapper').on('click','.swiper-slide',function(){
  let id=$(this).attr('index');
  sessionStorage.setItem('goodsId',id);
  location.href = 'detail.html';
})

$('.list').on('click','.detail',function(){
  let id=$(this).attr('index')
  sessionStorage.setItem('goodsId',id)
  location.href='detail.html'
})

$('.inpt').bind('input propertychange',function(el){
  let val=$(this).val()
  if(val.indexOf("'")!=-1){return}
    ajax({url:'../server/like.php',data:{keyword:val},dataType:'json',success:function(res){
      let {data}=res
      let shousuo=data.map(v=>{
        return `
        <li index=${v.id} class="s">${v.name}</li>
        `
      }).join('')
      if(!val){shousuo=''}
      $('.seek').html(shousuo)
    }})

})

$('.inpt').focus(function(){$('.seek').show();})
$('.nav-right').mouseleave(()=>{$(".seek").hide();$(".inpt").blur()})

$('.seek').on('click','.s',function(){
  let id=$(this).attr('index')
  let val=$(this).html()
  $('.inpt').val(val).attr('index',id)
})

$('.shoushu').click(function(){
  let id=$('.inpt').attr('index')
  if(!id)return layer.msg('您还没选择商品')
  sessionStorage.setItem('goodsId',id)
  $('.inpt').val('')
  location.href='detail.html'
})